<template>
  <input 
    :type="type"
    :placeholder="placeholder"
    :value="value"
  >
</template>

<script>
export default {
  name: 'MyInput',
  props: {
    type: {
      validator(value) {
        return [
          'text',
          'password',
          'email',
          'number'
        ].includes(value);
      }
    },
    placeholder: String,
    value: [String, Number]
  },
  methods: {
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
